import React from 'react';
import { Select } from 'antd';
import { ConfigProvider } from 'antd';

import s from './style.module.css';
import zhCN from 'antd/lib/locale/zh_CN';
const { Option } = Select;

// export default Select;
export default function SelectAnt({ ...props }) {
  const [isDown, setIsDown] = React.useState(false);
  const onDropdown = () => {
    setIsDown(!isDown);
  };
  return (
    <ConfigProvider locale={zhCN}>
      <Select
        locale={zhCN}
        {...props}
        onDropdownVisibleChange={onDropdown}
        getPopupContainer={(triggerNode) => triggerNode}
        suffixIcon={
          <div
            className={s.jt}
            style={{ transform: isDown ? 'rotate(45deg)' : 'rotate(-135deg)' }}
          ></div>
        }
      >
        {props.option.map((e) => {
          return (
            <Option locale={zhCN} value={e.value} key={e.value}>
              {e.label}
            </Option>
          );
        })}
      </Select>
    </ConfigProvider>
  );
}
